<template>
	<div>
		<Header></Header>
		<!-- 内容 -->
		<div class="w65 ma">
			<!-- 面包屑 -->
			<breadcrumb></breadcrumb>
		</div>
		<div class="conent-top">
			<div class="fwb fz1 p05lr0">基础信息</div>
			<table>
				<tr>
					<td class="fwb">编号</td>
					<td>{{ getDetails.number }}</td>
				</tr>
				<tr>
					<td class="fwb">产品名称</td>
					<td>{{ getDetails.name }}</td>
				</tr>
				<tr>
					<td class="fwb">产品描述</td>
					<td>{{ getDetails.describe }}</td>
				</tr>
				<tr>
					<td class="fwb">关键词</td>
					<td>{{ getDetails.key_word }}</td>
				</tr>
				<tr>
					<td class="fwb">产品一级类别</td>
					<td>{{ getDetails.one_class }}</td>
				</tr>
				<tr>
					<td class="fwb">产品二级类别</td>
					<td>{{ getDetails.two_class }}</td>
				</tr>
				<tr>
					<td class="fwb">生产日期</td>
					<td>{{ getDetails.addtime }}</td>
				</tr>
				<tr>
					<td class="fwb">生产格式名称</td>
					<td>{{ getDetails.format_name }}</td>
				</tr>
				<tr>
					<td class="fwb">生产密级名称</td>
					<td>{{ getDetails.classification_name }}</td>
				</tr>
				<tr>
					<td class="fwb">单位名称</td>
					<td>{{ getDetails.unit_name }}</td>
				</tr>
				<tr>
					<td class="fwb">服务对象</td>
					<td>{{ getDetails.service_object }}</td>
				</tr>
			</table>

			<div class="fwb fz1 p05lr0">扩展信息</div>
			<table>
				<tr>
					<td class="fwb">产品</td>
					<td>{{ getDetails.product }}</td>
				</tr>
				<tr>
					<td class="fwb">级类别</td>
					<td>{{ getDetails.class }}</td>
				</tr>
				<tr>
					<td class="fwb">关键字</td>
					<td>{{ getDetails.key_word_k }}</td>
				</tr>
			</table>

			<!-- <div class="fwb fz1 p05lr0">相关电子文件</div>
			<table>
				<tr>
					<td>
						<el-row :gutter="17">
							<el-col :span="3" class="c14a cp fwb"><div @click="download">下载</div></el-col>
						</el-row>
					</td>
				</tr>
			</table> -->
		</div>
		<!-- 查看大图 -->
		<dialogImg :lookImg="lookImg" :biggerImg="biggerImg" @handleClose="handleClose" v-if="biggerImg"></dialogImg>
		<!-- 底部 -->
		<Footer></Footer>
	</div>
</template>

<script>
import breadcrumb from '@/components/breadcrumb .vue';
import dialogImg from '@/components/dialogImg.vue';
import { geosciencesInfo, iiiustratedBooksInfo } from '@/api/resourceCenter.js';
export default {
	name: '',
	components: {
		breadcrumb,
		dialogImg
	},
	data() {
		return {
			biggerImg: false,
			lookImg: '',
			getDetails: {}
		};
	},
	created() {
		let stype = this.$route.query.stype;
		let id = this.$route.query.data;
		if (stype == 2) {
			let data = {
				id
			};
			geosciencesInfo(data).then(res => {
				this.getDetails = res.data;
			});
		} else {
			let data = {
				id
			};
			iiiustratedBooksInfo(data).then(res => {
				this.getDetails = res.data;
			});
		}
	},
	methods: {
		browse() {
			this.biggerImg = true;
		},
		handleClose(val) {
			this.biggerImg = val;
		},
		//下载
		download() {
			let alink = document.createElement('a');
			alink.href = this.lookImg;
			alink.download = '哈哈哈哈'; //图片名
			alink.click();
		}
	}
};
</script>

<style scoped lang="scss">
.conent-top {
	width: 65%;
	height: 65rem;
	padding-bottom: 1rem;
	margin: auto;
	overflow-y: auto;
}
table {
	width: 99%;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	// margin: 0;
	border-collapse: collapse;
	border-spacing: 0;
}
/*控制cellspacing*/
table td {
	width: 1.5rem;
	padding: 0.7rem;
	font-size: 0.9rem;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
</style>
